<template>
  <div class="element-text-view">
    <div class="content">
      <p>思路：</p>
      <div class="list">
        <p class="value gray">
          1.无限滚动其实就是两张或者两张以上的图片进行拼接
        </p>
        <p class="value gray">2.看似是在滚动，实际上是利用图片的定位改变</p>
        <p class="value gray">
          3.根据手势touchend的操作，从手按下到手指松开的Y轴的距离，就是本次滚动的距离（实际就是图片的top值改变的距离）
        </p>
        <p class="value gray">设图片的高度为h，top的移动位置就是(h,-h]</p>
      </div>
      <p>提示：</p>
      <p>
        简书分析地址：<a href="https://www.jianshu.com/p/c9b7590ee03a"
          >初级无限滚动用法</a
        >
      </p>
    </div>
  </div>
</template>


<script>
export default {};
</script>

<style lang="scss" scoped>
.element-text-view {
  height: 100%;
  overflow: auto;
  padding: 0 12px;
  .content {
    font-size: 14px;
    .gray {
      color: gray;
    }
    .label {
      margin: 8px;
    }
    .value {
      margin: 8px;
    }
  }
}
</style>